<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <title>One day escape</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <link rel="stylesheet" href="src/css/n.min.css">
    <script>
        (function(){
            var phoneWidth =  parseInt(window.screen.width);
            var phoneScale = phoneWidth/640;
            var isAndroid = RegExp("Android").test(navigator.userAgent);
            if (isAndroid) {
                document.write('<meta name="viewport" content="width=640, minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">');
            } else {
                document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
            }
        }());
    </script>
</head>

<body class="app" style="width: 100%;height: 100%;">

    <div class="container brown" style="width: 640px;margin: 0 auto;">

        <div class="swiper-container">
            <div class="swiper-wrapper" style="">
                <div class="city-name hide"></div>
                <div class="swiper-slide" style="background-size:auto 100%;background: url(src/images/slide/01.jpg)">
                    <i class="up icon-up"></i>
                </div>
                <div class="swiper-slide" style="background-size:auto 100%;background: url(src/images/slide/02.jpg)">
                    <i class="up icon-up"></i>
                </div>
                <div class="swiper-slide">
                    <i class="up icon-up"></i>
                </div>
            </div>
        </div>
    </div>

    <script src="src/js/zepto.min.js"></script>
    <script src="src/js/swiper.jquery.min.js"></script>

    <script>
        Zepto(function($){

            var getParam = function(name){
                var search = document.location.search;
                var pattern = new RegExp("[?&]"+name+"\=([^&]+)", "g");
                var matcher = pattern.exec(search);
                var items = null;
                if(null != matcher){
                    try{
                        items = decodeURIComponent(decodeURIComponent(matcher[1]));
                    }catch(e){
                        try{
                            items = decodeURIComponent(matcher[1]);
                        }catch(e){
                            items = matcher[1];
                        }
                    }
                }
                return items;
            };

            var cityName = getParam('city') || '';

            $(".swiper-wrapper").css("height",$(window).height());
            $('.city-name').removeClass('hide').html(cityName);

            new Swiper('.swiper-container', {
                direction: 'vertical',
                speed: 400,
                onTouchStart: function (self, event) {},
                onReachEnd: function(self) {
                    window.location.href = 'list.html?city=' + cityName;
                }
            });
        })
    </script>

</body>

</html>
